const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

let config = {
    mode: 'production',
    entry: {
        main: ['./app/index.js', 'react', 'react-dom'],
    },
    resolve: {
        extensions: [".js", ".json", ".jsx", ".css", ".pcss", "less"],
    },
    output: {
        path: path.resolve("dist"),
        filename: 'js/[name].[chunkhash:8].js',
        chunkFilename: "js/[name]-[id].[chunkhash:8].js",
    },
    optimization: {
        runtimeChunk: {
            name: "manifest"
        },
        splitChunks: {
            chunks: 'all',
            cacheGroups: {
                libs: {
                    name: "chunk-libs",
                    test: /node_modules/,
                    priority: 10,
                    chunks: "initial" // 只打包初始时依赖的第三方
                },
                blueprintjsCore: {
                    name: "chunk-blueprintjs-core",
                    priority: 20,
                    test: path.resolve("node_modules/@blueprintjs/core"),
                },
                blueprintjsTable: {
                    name: "chunk-blueprintjs-table",
                    priority: 20,
                    test: path.resolve("node_modules/@blueprintjs/table"),
                },
                blueprintjsIcons: {
                    name: "chunk-blueprintjs-icons",
                    priority: 20,
                    test: path.resolve("node_modules/@blueprintjs/icons"),
                },
                common: {
                    chunks: "initial",
                    name: "common",
                    minChunks: 2,
                    maxInitialRequests: 5,
                    minSize: 0
                },
            }
        }
    },
    plugins: [
        new BundleAnalyzerPlugin(),
        new ExtractTextPlugin('css/[name].[md5:contenthash:hex:8].css'),
        new OptimizeCSSPlugin({
            assetNameRegExp: /\.css$/g,
            cssProcessor: require('cssnano'),
            cssProcessorOptions: {
                discardComments: {
                    removeAll: true
                },
                safe: true
            },
            canPrint: true
        }),
        new HtmlWebpackPlugin({
            filename: "index" + '.html',
            template: 'index.html',
            inject: true,
            title: "main",
            minify: {
                removeComments: true,
                collapseWhitespace: true,
                removeAttributeQuotes: true
            },
            chunks: ['manifest', 'chunk-libs', 'chunk-blueprintjs-core', 'chunk-blueprintjs-table', 'chunk-blueprintjs-icons', 'main'],
            hash: false,
            chunksSortMode: 'dependency'
        }),
        new CleanWebpackPlugin(["dist"], {
            root: path.resolve(__dirname, '../'),
            verbose: true,
            dry: false
        })
    ],
    module: {
        rules: [{test: /\.(js|jsx)$/, loader: 'babel-loader', exclude: /node_modules/,},
            {
                test: /\.(css)$/,
                use: ExtractTextPlugin.extract({
                    fallback: {loader: "style-loader"},
                    use: [{loader: "css-loader"}]
                })
            }, 
            {test: /\.less$/, loaders: ['style-loader', 'css-loader', 'less-loader'], },
            {test: /\.(png|jpg|gif|ttf|eot|woff|woff2|svg)$/, loader: 'url-loader?limit=8192&name=[name].[hash:8].[ext]&publicPath=' + 'resource' + '&outputPath=' + 'resource' + '/'},
            {test: /\.swf$/, loader: 'file?name=js/[name].[ext]'}
        ]
    }
};

module.exports = config;